<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link rel="icon" href="/favicon.ico">
    <title>发布商品-橙子校园</title>
    <meta name="keywords" content="校园二手,校园二手市场,大学二手,大学二手市场,大学生二手,大学二手网站,校园二手网站,校园二手app,桂林二手,桂林校园二手">
    <meta name="description"
          content="橙子校园网是由柚子校园团队开发的一个高校校园综合性的二手交易平台，校园二手网、大学生二手市场、大学生二手网，覆盖多所大学的大学生。涵盖二手手机、二手自行车、二手电动车、二手教材、二手书、二手电脑、二手数码产品等校园二手信息，满足大学生校园内的二手交易、二手求购的需求。买卖二手，尽在橙子校园">
    <link href="css/chunk-vendors.ca268116.css" rel="stylesheet">
    <link href="css/app.d8065f99.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/chunk-4b1544d0.a9b19322.css">
    <script charset="utf-8" src="js/chunk-4b1544d0.805cdbf0.js"></script>
    <!--导入vue和ajax-->
    <link rel="stylesheet" type="text/css" href="http://www.layuicdn.com/layui/css/layui.css"/>
    <script src="https://www.layuicdn.com/layui/layui.js"></script>
    <script type="text/javascript" src="https://lib.baomitu.com/vue/2.6.12/vue.min.js"></script>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/axios/0.12.0/axios.min.js"></script>
    <script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>

<body>
<div data-v-6505e6d8="" id="app">
    <!---->
    <div data-v-e53a43c0="" data-v-6505e6d8="" class="wrap">
        <div data-v-e53a43c0="" class="top"><img data-v-e53a43c0="" src="img/school_choose.d248fb38.png"></div>
        <div data-v-e53a43c0="" class="inner">
            <div data-v-e53a43c0="" class="content-box">
                <h2 data-v-e53a43c0="" class="text-center title">发布商品</h2>
                <form data-v-e53a43c0="" autocomplete="off" class="ivu-form ivu-form-label-right">
                    <!--标题-->
                    <div data-v-e53a43c0="" class="ivu-form-item"><label class="ivu-form-item-label"
                                                                         style="width: 80px;">标题</label>
                        <div class="ivu-form-item-content" style="margin-left: 80px;">
                            <div data-v-e53a43c0="" class="ivu-input-wrapper ivu-input-wrapper-default ivu-input-type">
                                <!---->
                                <!----><i
                                    class="ivu-icon ivu-icon-ios-loading ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                                <input autocomplete="off" spellcheck="false" type="text" placeholder="很重要，显示在列表页"
                                       class="ivu-input ivu-input-default" id="pname">
                                <!---->
                            </div>
                            <!---->
                        </div>
                    </div>
                    <!--简介-->
                    <div data-v-e53a43c0="" class="ivu-form-item"><label class="ivu-form-item-label"
                                                                         style="width: 80px;">简介</label>
                        <div class="ivu-form-item-content" style="margin-left: 80px;">
                            <div data-v-e53a43c0="" class="ivu-input-wrapper ivu-input-wrapper-default ivu-input-type">
                                <textarea wrap="soft" autocomplete="off" spellcheck="false" placeholder="很重要,显示在商品详情页" id="detail"
                                          rows="2" class="ivu-input"
                                          style="height: 50px; min-height: 50px; max-height: 110px; overflow-y: hidden;"></textarea>
                            </div>
                            <!---->
                        </div>
                    </div>
                    <!--标价-->
                    <div data-v-e53a43c0="" class="ivu-form-item"><label class="ivu-form-item-label"
                                                                         style="width: 80px;">标价</label>
                        <div class="ivu-form-item-content" style="margin-left: 80px;">
                            <div data-v-e53a43c0="" class="ivu-input-wrapper ivu-input-wrapper-default ivu-input-type"
                                 style="width: 300px;">
                                <!---->
                                <!----><i
                                    class="ivu-icon ivu-icon-ios-loading ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                                <input autocomplete="off" spellcheck="false" type="text" placeholder="数字,想卖的价格" id="marketPrice"
                                       class="ivu-input ivu-input-default">
                                <!---->
                            </div>
                            <!---->
                        </div>
                    </div>
                    <!--原价-->
                    <div data-v-e53a43c0="" class="ivu-form-item"><label class="ivu-form-item-label"
                                                                         style="width: 80px;">原价</label>
                        <div class="ivu-form-item-content" style="margin-left: 80px;">
                            <div data-v-e53a43c0="" class="ivu-input-wrapper ivu-input-wrapper-default ivu-input-type"
                                 style="width: 300px;">
                                <!---->
                                <!----><i
                                    class="ivu-icon ivu-icon-ios-loading ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                                <input autocomplete="off" spellcheck="false" type="text"
                                       placeholder="数字,购买时的价格,如忘记可填大概价格，让用户对性价比一目了然" id="shopPrice"
                                       class="ivu-input ivu-input-default">
                                <!---->
                            </div>
                            <!---->
                        </div>
                    </div>
                    <!--分类-->
                    <div data-v-e53a43c0="" class="ivu-form-item"><label class="ivu-form-item-label"
                                                                         style="width: 80px;">分类</label>
                        <div class="ivu-form-item-content" style="margin-left: 80px;">
                            <div data-v-e53a43c0="" class="ivu-cascader ivu-cascader-size-default"
                                 style="width: 300px;">
                                <div class="ivu-cascader-rel"><input type="hidden">
                                    <div class="ivu-input-wrapper ivu-input-wrapper-default ivu-input-type">
                                        <!---->
                                        <!----><i
                                            class="ivu-icon ivu-icon-ios-loading ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                                        <input autocomplete="off" spellcheck="false" type="text" @click="showlei()" v-model="lei"
                                               placeholder="合适的分类买家能更好地找到您的商品" readonly="readonly"
                                               class="ivu-input ivu-input-default">
                                        <!---->
                                    </div>
                                    <div class="ivu-cascader-label" style="display: none;"></div>
                                    <i class="ivu-icon ivu-icon-ios-close-circle ivu-cascader-arrow"
                                       style="display: none;"></i> <i
                                            class="ivu-icon ivu-icon-ios-arrow-down ivu-cascader-arrow"></i></div>
                                <div class="ivu-select-dropdown" style="display: none;">
                                    <div><span><ul class="ivu-cascader-menu"><li v-for="c in clist" class="ivu-cascader-menu-item" @click="showleichild(c.cid)">
                                        {{c.cname}}
                                        <i class="ivu-icon ivu-icon-ios-arrow-forward"></i> <!----></li></ul><!----></span>
                                        <div class="ivu-cascader-dropdown" style="display: none;">
                                            <ul class="ivu-select-dropdown-list">
                                                <li v-for="ch in chlist" class="ivu-select-item" @click="setlei(ch.csid,ch.csname)">
                                                    <span></span>{{ch.csname}}<span></span></li>
                                            </ul>
                                        </div>
                                        <ul class="ivu-cascader-not-found-tip" style="display: none;">
                                            <li>无匹配数据</li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <!---->
                        </div>
                    </div>
                    <!--邮费-->
                    <div data-v-e53a43c0="" class="ivu-form-item"><label class="ivu-form-item-label"
                                                                         style="width: 80px;">邮费</label>
                        <div class="ivu-form-item-content" style="margin-left: 80px;">
                            <div data-v-e53a43c0="" class="ivu-input-wrapper ivu-input-wrapper-default ivu-input-type"
                                 style="width: 300px;">
                                <!---->
                                <!----><i
                                    class="ivu-icon ivu-icon-ios-loading ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                                <input autocomplete="off" spellcheck="false" type="text" placeholder="填写数字" id="franking"
                                       class="ivu-input ivu-input-default">
                                <!---->
                            </div>
                            <!---->
                        </div>
                    </div>
                    <!--图片上传-->
                    <div data-v-e53a43c0="" class="ivu-form-item"><label class="ivu-form-item-label"
                                                                         style="width: 80px;">图片上传</label>
                        <div class="ivu-form-item-content" style="margin-left: 80px;">
                            <div data-v-e53a43c0="" style="color: rgb(136, 136, 136);">
                                请在上传前使用ps或者QQ截图对图片进行裁剪，才会不变形，更美观。推荐750*750px（像素）
                            </div>
                            <div class="layui-upload">
                                <div data-v-e53a43c0="" class="demo-upload-list" style="display: none;">
                                    <img data-v-e53a43c0="" id="headImg">
                                    <div data-v-e53a43c0="" class="set-thumb">
                                        封面
                                    </div>
                                    <div data-v-e53a43c0="" class="demo-upload-list-cover">
                                        <i data-v-e53a43c0="" class="ivu-icon ivu-icon-ios-eye-outline"></i>
                                        <i data-v-e53a43c0="" class="ivu-icon ivu-icon-ios-trash-outline"></i>
                                    </div>
                                </div>
                                <div data-v-e53a43c0="" class="ivu-upload" style="display: inline-block; width: 100px;" id="headBtn">
                                    <div class="ivu-upload ivu-upload-drag">
                                        <input type="file" multiple="multiple"  class="ivu-upload-input">
                                        <div data-v-e53a43c0="" style="width: 100px; height: 100px; line-height: 100px;"><i
                                                data-v-e53a43c0="" class="ivu-icon ivu-icon-ios-camera"
                                                style="font-size: 30px; color: rgb(102, 102, 102);"></i></div>
                                    </div>
                                    <!---->
                                </div>
                            </div>


                            <!---->
                            <!---->
                        </div>
                    </div>
                    <!--提交-->
                    <div data-v-e53a43c0="" class="ivu-form-item">
                        <!---->
                        <div class="ivu-form-item-content" style="margin-left: 80px;">
                            <button   type="button" class="ivu-btn ivu-btn-primary ivu-btn-long">
                                <!----> <!----> <span @click="submit()" style="display: inline-block;width: 100%;height:100%;">提 交</span></button>
                            <!---->
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<!--提交-->
<script>
    let flag = false;
    let image="";
    var v=new Vue({
        el:'#app',
        data:{
            clist:{},
            chlist:{},
            lei:"",
            csid:""
        },
        created(){
            //查询分类
            axios.get("selectAllCategory").then(res=>{
                console.dir(res.data);
                this.clist=res.data;
            })
        },
        mounted(){
            //常规使用-普通图片上传
            layui.upload.render({
                elem:'#headBtn',
                url:'upload',//改成您自己上传的接口
                field:"head",
                done:function(res){
                    //如果上传失败
                    if(res.code==0){
                        return layui.layer.msg('上传失败');
                    }
                    //显示图片
                    headImg.src=res.data;
                    image=res.data;
                    console.log(image);
                    $(".demo-upload-list").css("display", "inline-block");
                }
            });
        },
        methods:{
            showleichild(cid){
                //查询分类
                axios.get("selectCategorySecondBycid?cid="+cid).then(res=>{
                    this.chlist=res.data;
                });
                $(".ivu-cascader-dropdown").css("display","inline-block") ;
            },
            showlei(){
                //显示类别
                if(flag==false){
                    $(".ivu-select-dropdown").css("display","inline-block") ;
                    flag=true;
                }else{
                    flag = false;
                    $(".ivu-select-dropdown").css("display","none") ;
                    $(".ivu-cascader-dropdown").css("display","none") ;
                }
            },
            setlei(csid,csname){
                console.log(csid+""+csname);
                //用来设置类别
                this.lei=csname;
                this.csid=csid;
                //设置完之后将类别隐藏
                flag = false;
                $(".ivu-select-dropdown").css("display","none") ;
                $(".ivu-cascader-dropdown").css("display","none") ;

            },
            submit() {
                //提交
                var pname = $("#pname").val();
                var detail=$("#detail").val();
                var marketPrice=$("#marketPrice").val();
                var shopPrice=$("#shopPrice").val();
                var franking=$("#franking").val();
                var csid=this.csid;
                console.log(image);
                $.post("/addProduct",{uid:1,pname:pname,detail:detail,marketPrice:marketPrice,shopPrice:shopPrice,franking:franking,csid:csid,image:image},function (res) {
                    //添加商品成功
                    alert(res.msg);
                    console.dir(res);
                })
            }
        }
    });

</script>
<script src="js/chunk-vendors.c696eafb.js"></script>
<div class="ivu-loading-bar" style="height: 2px; display: none;">
    <div class="ivu-loading-bar-inner ivu-loading-bar-inner-color-primary" style="width: 0%; height: 2px;"></div>
</div>
<textarea wrap="soft" style="letter-spacing:normal;line-height:21px;padding-top:4px;padding-bottom:4px;font-family:&quot;Helvetica Neue&quot;, Helvetica, &quot;PingFang SC&quot;, &quot;Hiragino Sans GB&quot;, &quot;Microsoft YaHei&quot;, 微软雅黑, Arial, sans-serif;font-weight:400;font-size:14px;text-rendering:auto;text-transform:none;width:659.556px;text-indent:0px;padding-left:7px;padding-right:7px;border-width:1px;box-sizing:border-box;
  min-height:0 !important;
  max-height:none !important;
  height:0 !important;
  visibility:hidden !important;
  overflow:hidden !important;
  position:absolute !important;
  z-index:-1000 !important;
  top:0 !important;
  right:0 !important
"></textarea>
<div data-v-e53a43c0="" data-transfer="true" class="v-transfer-dom">
    <div class="ivu-modal-mask" style="z-index: 1003; display: none;"></div>
    <div class="ivu-modal-wrap ivu-modal-hidden" style="z-index: 1003;">
        <div class="ivu-modal" style="width: 520px; display: none;">
            <div class="ivu-modal-content">
                <a class="ivu-modal-close"><i class="ivu-icon ivu-icon-ios-close"></i></a>
                <div class="ivu-modal-header">
                    <div class="ivu-modal-header-inner">图片预览</div>
                </div>
                <div class="ivu-modal-body"></div>
                <div class="ivu-modal-footer">
                    <button type="button" class="ivu-btn ivu-btn-text ivu-btn-large"><!----> <!----> <span>取消</span>
                    </button>
                    <button type="button" class="ivu-btn ivu-btn-primary ivu-btn-large"><!----> <!----> <span>确定</span>
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>
</body>

</html>